
{extend name='public/base' /}

{block name="content"}

<div class="layui-col-md12">

    <div class="layui-card">
        <div class="layui-card-body layui-row ">
            <form action="" class="layui-form" method="get">
                <div class="layui-form-item layui-form-pane">
                    <div class="layui-inline">
                        <label class="layui-form-label">选择账号：</label>
                        <div class="layui-input-inline">
                            <select name="wx_aid" lay-filter="select" lay-verify="required" lay-search="">
                                <option value="">直接选择或搜索选择</option>
                                {volist name='wxAccount' id ='vo'}
                                <option value="{$vo.id}" {if $vo.status==1 } selected {/if}>{$vo.wxname}</option>
                                {/volist}
                            </select>
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label">昵称：</label>
                        <div class="layui-input-inline">
                            <input type="text"  name="keys" lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-inline" style="padding-left: 20px;">
                        <button class="layui-btn icon-btn layui-btn-sm" lay-filter="search" lay-submit="">
                            <i class="layui-icon"></i>搜索
                        </button>
                        <button class="layui-btn icon-btn layui-btn-normal layui-btn-sm" onclick="javascript:window.location.reload();">
                            <i class="layui-icon layui-icon-refresh"></i> 重置
                        </button>
                    </div>

                </div>

            </form>
        </div>

    </div>

    <div class="layui-card">
        <div class="layui-card-header" style="line-height: 55px;">
            <div class="layui-btn-container do_btn">
                <!--按钮区-->
                 <button class="layui-btn layui-btn-sm" data-type="anasy">同步粉丝</button>
                <button class="layui-btn layui-btn-sm layui-btn-primary" data-type="reload"><i class="fa fa-refresh"></i> 刷新</button>

            </div>
        </div>
        <div class="layui-card-body">

            <!--表格区-->

            <div class="yys-fluid yys-wrapper">
                <div class="layui-row lay-col-space20">
                    <div class="layui-cos-xs12 layui-col-sm12 layui-col-md12 layui-col-lg12">
                        <section class="yys-body">
                            <div class="yys-body-content clearfix changepwd">
                                <div class="layui-col-lg12 layui-col-md10 layui-col-sm12 layui-col-xs12" style="width:100%">
                                    <div class="user-tables">
                                        <table id="tableFilter" lay-filter="tableFilter"> </table>
                                    </div>
                                </div>
                            </div>
                        </section>
                    </div>
                </div>
            </div>


        </div>
    </div>

</div>


{/block}


{block name="js"} <!--js处理区-->

<script type="text/html" id="subscribe">
    <input type="checkbox" name="status" value="{{d.id}}" disabled lay-skin="switch" lay-text="关注|未关注" lay-filter="status" {{ d.status == 1 ? 'checked' : '' }}>
</script>

<script type="text/html" id="sex">
    {{# if(d.sex==1){ }}
    男
    {{# }else if( d.sex==2){ }}
    女
    {{# }else{ }}
    保密
    {{# } }}
</script>

<script type="text/html" id="create_time">
    {{layui.util.toDateString(d.subscribe_time*1000, 'yyyy-MM-dd HH:mm:ss')}}
</script>
<script type="text/html" id="update_time">
    {{layui.util.toDateString(d.unsubscribe_time*1000, 'yyyy-MM-dd HH:mm:ss')}}
</script>


<script>

    layui.use(['element', 'table', 'form', 'jquery', 'lucky','util'], function () {
        var element = layui.element;
        var form = layui.form;
        var table = layui.table;
        var $ = layui.jquery;
        var lucky=layui.lucky;
        var util=layui.util;

        form.render();

        // layer.load(2);
        table.render({
            elem: '#tableFilter',
            url:"{:url('fans')}",
            //toolbar: '#toolbarDemo',
            even: true, //开启隔行背景
            id:'table_id',
            method: 'post',
            page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip','last'] //自定义分页布局
                ,groups: 5 //只显示 1 个连续页码
                ,first: false //不显示首页
                ,last: false //不显示尾页
                ,limit:30
                ,limits:[10,20,30,50]
            },
            text: {
                none: '暂无相关数据'
            },
            cols: [[
               /* {type: 'checkbox'},*/
                {field:'headimgurl',title:"头像", width:80,align:"center",templet:function (d) {
                        return '<img  src="'+d.headimgurl+'" class="layui-nav-img" alt="无图" />';
                    }},
                {field: 'nickname', title: '昵称', width: 200,sort: true},
                {field: 'sex', title: '性别', width: 120, templet:'#sex',sort: true},
                 {field: 'openid', title: 'openid', width: 180, sort: true},
                {field: 'city', title: '地址', width: 150,templet:function (d) {
                        return d.country+d.province+d.city;
                    }},
                {field: 'subscribe', title: '是否关注', width: 120,templet:'#subscribe',sort: true},
                {field: 'tag', title: '标签', width: 120},
                {field: 'subscribe_time', title: '订阅时间', width: 180,templet:'#create_time',sort: true},
                {field: 'unsubscribe_time', title: '解订阅时间', width: 180,templet:'#update_time',sort: true},
            ]],

            done: function (res) {
                layer.closeAll('loading');
            }
        });

        /**
         * 表格搜索
         */
        form.on('submit(search)', function (obj) {
            lucky.CreateSearch("table_id",obj.field); //查询
            return false;
        });


        var active = {
            anasy:function(){
                var wx_aid = $("select[name='wx_aid']").val();
                lucky.Form_Confirm('{:url("fansAysn")}',{wx_aid:wx_aid},"确定同步选择的账号粉丝？",'table_id');
                return false;
            },
            reload: function(){
                lucky.CreateReload("table_id");
            }
        };

        $('.do_btn .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });


    });

</script >


{/block}
